<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <head th:replace="common/common_css :: css(~{::link})">
    </head>
    <title>门诊就诊</title>
    <link rel="stylesheet" type="text/css" th:href="@{css/mcss/mcss_outpatient.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/css/chosen.min.css}"/>
    <link type="text/css" rel="stylesheet" th:href="@{/css/preloader.css}">
</head>
<body>

<div id="preloader">
    <div id="preloader-inner"></div>
</div>
<div id="wrapper">
    <div th:replace="common/common_left :: left"></div>

    <div id="content-wrapper" class="d-flex flex-column content-wrapper">
        <div id="content">
            <div th:replace="common/common_head :: head"></div>

            <!--正文-->
            <div>
                <div class="card shadow mb-4" style="margin-left: 2.5%;height: 818px">

                    <div class="card-body">
                        <div class="outpatient-div">
                            <div class="split split-horizontal" id="outpatient-one">
                                <div class="card-header py-3">
                                    <h6 class="m-0 font-weight-bold text-primary">患者基本信息</h6>
                                </div>

                                <div style="margin-left: 5%">
                                    <!--                                    <form id="patientInfo">-->
                                    <div class="textbox">
                                        卡号<input type="text" style="width: 110px" id="cardId">
                                        <div class="cardId-search">
                                            <button class="btn btn-success" onclick="javascript:getCardInfo()">
                                                <img class="png" th:src="@{/images/icon/search.png}">
                                            </button>
                                        </div>
                                        <!--                                        <div class="mybtn1">-->
                                        <!--                                            <button class="btn btn-info" onclick="getCardIdInfor(0)">读取就诊卡</button>-->
                                        <!--                                        </div>-->
                                    </div>


                                    <div class="textbox_2">

                                        <input type="hidden" id="patientId">
                                        <input type="hidden" id="registerId">
                                        <div id="new-img" style=" visibility: hidden">
                                            <img style="width: 35px;height: 35px;"
                                                 th:src="@{/images/icon/newPatien.png}" title="请记录新开卡的病人信息">
                                        </div>
                                        婚姻<input type="text" id="maritalStatus" style="width: 110px"
                                                 name="marriage">&emsp;
                                        职业<input type="text" id="career" style="width:110px" name="career">
                                        <input type="text" id="queueId" hidden="hidden"><!--隐藏队列Id-->
                                        <br>
                                        <br>
                                        <br>
                                        <div style="display: flex;">
                                            <div>个人史</div>
                                            <textarea id="personalHistory"></textarea>
                                        </div>

                                        <div style="display: flex; margin-top: 30px">
                                            <div>既往史</div>
                                            <textarea type="text" id="pastHistory"></textarea>
                                        </div>

                                        <div style="display: flex;margin-top: 30px">
                                            <div>家族史</div>
                                            <textarea type="text" id="familyHistory"></textarea>
                                        </div>

                                        <div class="mybtn2" id="new-submit">
                                            <button class="btn btn-info" onclick="javascript:changePatientInfo()">
                                                提交修改
                                            </button>
                                        </div>

                                        <!--                                    </form>-->
                                        <div style="display: flex;margin: 20px 0 0 17px;">
                                            <div>主诉</div>

                                            <textarea id="conditionDescr"></textarea>
                                        </div>

                                    </div>
                                </div>
                            </div>
                            <div class="split split-horizontal" id="outpatient-two">
                                <div>
                                    <div class="card-header py-3">
                                        <h6 class="m-0 font-weight-bold text-primary">电子处方</h6>
                                    </div>

                                    <div style="display: flex">
                                        <h4 style="font-family: STLiti,serif;color: #2C9FAF">SHOSPITAL</h4>

                                        <h2>门诊处方笺</h2>

                                        <div style="font-size: 15px;margin-left: 26%">
                                            <div id="nowDate"></div>
                                        </div>

                                    </div>

                                    <div class="textbox_3">

                                        处方号<input type="text" id="prescriptionNum" style="width: 170px"
                                                  readonly="readonly">
                                        科室<input type="text" id="department" style="width: 110px" readonly="readonly">&emsp;
                                        日期<input type="text" id="date" style="width: 133px" readonly="readonly">
                                        <br> <br>
                                        姓名<input type="text" id="name" style="width: 110px" readonly="readonly">&emsp;
                                        性别<input type="text" id="sex" style="width: 90px" readonly="readonly">
                                        民族<input type="text" id="nationality" style="width: 90px" readonly="readonly">
                                        年龄<input type="text" id="age" style="width:90px" readonly="readonly">
                                        <br> <br>
                                        初步诊断<input type="text" id="diagnosisResult" style="width:505px">
                                    </div>

                                    <div style="display: flex">
                                        <div style="font-size: 1.1rem">
                                            <img style="width: 70px;height: 70px"
                                                 th:src="@{/images/icon/prescription.png}">
                                        </div>


                                    </div>

                                    <div style="margin: 20px 0 0 185px" id="drugs">
                                        <ol>

                                        </ol>
                                    </div>

                                </div>
                            </div>

                            <div class="split split-horizontal" id="outpatient-three">
                                <div>

                                    <div>

<!--                                        <div class="card-header py-3">-->
<!--                                            <h6 class="m-0 font-weight-bold text-primary">身体检查</h6>-->
<!--                                        </div>-->

<!--                                        <div style="width: 100%;margin-top: 20px">-->
<!--                                            <div style="width: 100px">检查结果:</div>-->
<!--                                            <div class="testResult">-->
<!--                                                体温<input type="text" id="bodyTemperature" style="width: 70px"-->
<!--                                                         readonly="readonly">℃&emsp;-->
<!--                                                脉搏<input type="text" id="pulse" style="width: 70px"-->
<!--                                                         readonly="readonly">次/分&emsp;-->
<!--                                                <button class="btn btn-info mybutton"-->
<!--                                                        onclick="getMedicalExamination()">-->
<!--                                                    更新-->
<!--                                                </button>-->

<!--                                                <br> <br>-->
<!--                                                心率<input type="text" id="heartRate" style="width: 70px"-->
<!--                                                         readonly="readonly">次/分&emsp;-->
<!--                                                血压<input type="text" id="bloodPressure" style="width: 70px"-->
<!--                                                         readonly="readonly">mmHg-->
<!--                                            </div>-->

<!--                                            <br>-->
<!--                                            <div style="margin-left: 300px;">-->
<!--                                                <button class="btn btn-info mybutton2" onclick="ProcessLater()">稍后处理-->
<!--                                                </button>-->
<!--                                            </div>-->
<!--                                        </div>-->

                                        <div>
                                            <div class="card-header py-3">
                                                <h6 class="m-0 font-weight-bold text-primary">处方药</h6>
                                            </div>
                                            <!--<div>
                                                <button class="btn btn-info mybutton2" onclick="selectTemplate()">选择模板
                                                </button>
                                            </div>-->

                                            <div style="margin-left: 10px">
                                                <div style="display: flex;margin-top: 20px">
                                                    <div>
                                                        药品:
                                                    </div>
                                                    <div style="margin-left: 10px">
                                                        <select class='drugSelect' data-placeholder=' '>
                                                            <option value=""></option>

                                                        </select>
                                                    </div>
                                                </div>
                                                <br>
                                                <!--规格-->
                                                <div style="display: flex;">
                                                    <div>
                                                        药品规格：
                                                    </div>
                                                    <div>
                                                        <input type="text" id="specification" style="width: 150px"
                                                               readonly="readonly">
                                                        <input type="hidden" id="price">
                                                    </div>
                                                </div>
                                                <br>
                                                <div style="display: flex">
                                                    <div>
                                                        用法：
                                                    </div>
                                                    <div>
                                                        <input type="text" style="width: 70px" id="usage">
                                                    </div>
                                                    <div style="margin-left: 10px">
                                                        <select class='drugMethod' data-placeholder=' '>
                                                            <option value=""></option>
                                                            <option value="口服">口服</option>
                                                            <option value="外用">外用</option>
                                                        </select>
                                                    </div>
                                                    <div style="margin-left: 10px">
                                                        <select class='drugNum' data-placeholder=' '>
                                                            <option value=""></option>
                                                            <option value="每日一次">每日一次</option>
                                                            <option value="每日两次">每日两次</option>
                                                            <option value="每日三次">每日三次</option>
                                                        </select>
                                                    </div>
                                                </div>

                                                <div style="display: flex;">
                                                    <div style="margin: 25px 0 20px 60px; ">
                                                        <button class="btn btn-info mybutton" onclick="emptyDrugs()">清空
                                                        </button>
                                                    </div>
                                                    <div style="margin: 25px 0 20px 195px; ">
                                                        <button class="btn btn-info mybutton" onclick="addDrugs()">添加
                                                        </button>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="card-header py-3">
                                                <h6 class="m-0 font-weight-bold text-primary">医嘱</h6>
                                            </div>

                                            <div style="display: flex;margin-top: 20px">
                                                <div>
                                                    添加医嘱：
                                                </div>
                                                <textarea id="medicalOrder"
                                                          style="height: 80px;width: 260px" maxlength="15"></textarea>
                                            </div>

                                            <div style="margin: 25px 0 20px 290px; ">
                                                <button class="btn btn-info mybutton2" onclick="addMedicalRecord()">门诊完成
                                                </button>
                                            </div>
                                        </div>

                                    </div>

                                </div>
                            </div>
                        </div>

                        <!--队列-->
                        <button class="showbar"></button>
                        <div class="widget-bar">
                            <div style="display: flex;">
                                <h3>患者队列</h3>
                                <button style="margin-left: 115px;margin-top: 7px" class="btn btn-info" title="刷新"
                                        onclick="getAllOutpatientQueue()">
                                    <i class="fa fa-sync"></i>
                                </button>
                            </div>

                            <!--稍后处理的就诊病人-->
                            <div id="allPatientLater">
                                <table id="alloutpatientqueue">

                                </table>
                            </div>
                        </div>

                    </div>

                </div>
            </div>


        </div>
    </div>

</div>
<div>
    <div th:replace="common/common_js :: js(~{::script})"></div>
    <script type="text/javascript" th:src="@{/js/jquery.preloader.min.js}"></script>
    <script type="text/javascript" th:src="@{/js/chosen.jquery.min.js}"></script>
    <script type="text/javascript" th:src="@{/js/split.min.js}"></script>
    <script th:src="@{/sb-admin-2/bootstrap/bootstrap-table.min.js}"></script>
    <script th:src="@{/sb-admin-2/bootstrap/bootstrap-table-zh-CN.js}"></script>
    <script type="text/javascript" th:src="@{/js/mjs/mjs_outpatient.js}"></script>
    <script type="text/javascript" th:src="@{/js/Print.js}"></script>
</div>
</body>
<script>
    window.onload = function () {
        getAllMedication();
        getAllOutpatientQueue();
    };

    /** 获取就诊卡信息 **/
    function getCardInfo() {
        var cardId = $("#cardId").val();
        var parm = {"cardId": cardId};
        $.post("/outpatient/getCardIdInfo", parm, function (data) {
            if (data.state == 200) {
                var cardInfo = data.data;
                var date = new Date(cardInfo.date).toLocaleDateString().replace(/\//g, '-');
                $("#cardId").val(cardInfo.cardId);
                $("#name").val(cardInfo.name);
                $("#sex").val(cardInfo.sex);
                $("#nationality").val(cardInfo.nationality);
                $("#age").val(cardInfo.age);
                $("#department").val(cardInfo.department);
                $("#maritalStatus").val(cardInfo.maritalStatus);
                $("#career").val(cardInfo.career);
                $("#date").val(date);
                $("#prescriptionNum").val(cardInfo.prescriptionNum);
                $("#patientId").val(cardInfo.patientId);
                $("#pastHistory").val(cardInfo.pastHistory);
                $("#personalHistory").val(cardInfo.personalHistory);
                $("#familyHistory").val(cardInfo.familyHistory);
                $("#registerId").val(cardInfo.registerId);

            } else {
                alert(data.message);
            }
        })
    };

    /** 提交/更改患者信息 **/
    function changePatientInfo() {
        var cardId = $("#cardId").val();
        var maritalStatus = $("#maritalStatus").val();
        var career = $("#career").val();
        var personalHistory = $("#personalHistory").val();
        var pastHistory = $("#pastHistory").val();
        var familyHistory = $("#familyHistory").val();
        var patient = {
            "cardId": cardId, "maritalStatus": maritalStatus,
            "career": career, "personalHistory": personalHistory,
            "pastHistory": pastHistory, "familyHistory": familyHistory
        };
        alert(patient);
        $.post("/outpatient/savePatientInfo", patient, function (data) {
            if (data.state == 200) {
                alert(data.message);
            } else {
                alert(data.message);
            }
        })
    };

    /** 获取药品 **/
    function getAllMedication() {
        $.post("/outpatient/getMedication", function (data) {
            var optionHtml = '<option value=""></option>';
            $.each(data.data, function (i) {
                optionHtml += '<option value="' + data.data[i].name + '" >' + data.data[i].name + '</option>';
            });
            $('.drugSelect').html(optionHtml).trigger("chosen:updated").chosen({
                no_results_text: "没有找到结果！",
                search_contains: true,
                allow_single_deselect: true,
                disable_search: false,
                disable_search_threshold: 0, //当选项少等于于指定个数时禁用搜索。
                inherit_select_classes: true, //是否继承原下拉框的样式类，此处设为继承
                /*placeholder_text_single: '',*/ //单选选择框的默认提示信息，当选项为空时会显示。如果原下拉框设置了data-placeholder，会覆盖这里的值。

                max_shown_results: 5, //下拉框最大显示选项数量
                display_disabled_options: false,
                single_backstroke_delete: false, //false表示按两次删除键才能删除选项，true表示按一次删除键即可删除
                case_sensitive_search: false, //搜索大小写敏感。此处设为不敏感
                group_search: false, //选项组是否可搜。此处搜索不可搜
                include_group_label_in_selected: true //选中选项是否显示选项分组。false不显示，true显示。默认false。
            }).change(function () {

                drug = $(".drugSelect option:selected").val();
                var parm = {"medicationName": drug};
                $.get("/outpatient/getMedicationInfo", parm, function (data) {
                    $("#specification").val(data.data.specification);
                    $("#price").val(data.data.price)
                })
            })
        })
    }

    /** 添加药品信息 **/
    var allPrice = 0;

    function addDrugs() {
        var cardId = $("#cardId").val();
        var usage = $("#usage").val();
        var price = parseInt($("#price").val());
        var specification = $("#specification").val();
        drug = $(".drugSelect option:selected").val();
        if (drug == null || drug === '') {
            swal("请先选择药品！", "", "error");
            return false;
        }
        if (usage == null || usage === '') {
            swal("请填写药品每次剂量！", "", "error");
            return false;
        }

        if (drugMethod == null || drugMethod === '') {
            swal("请选择药品服用方式！", "", "error");
            return false;
        }

        if (drugNum == null || drugNum === '') {
            swal("请选择药品每日服用次数！", "", "error");
            return false;
        }
        if (cardId == null || cardId === '') {
            swal("请先读取就诊卡！", "", "error");
            return false;
        }

        $("#drugs ol").append('<li>' + drug + '<span style="margin-left:100px">'
            + specification + '</span></li><div style="margin: 10px 0 10px 5px;">用法：<sapn>'
            + usage + '</sapn><sapn  style="margin-left:40px">' + drugMethod
            + '</sapn><sapn  style="margin-left:60px">' + drugNum + '</sapn></div>');

        allPrice = allPrice + price;
    };

    /** 添加门诊信息 **/
    function addMedicalRecord() {
        var cardId = $("#cardId").val();
        var diagnosisResult = $("#diagnosisResult").val();
        var medicalOrder = $("#medicalOrder").val();
        var queueId = $("#queueId").val();
        var patientId = $("#patientId").val();
        var patientName = $("#name").val();
        var registerId = $("#registerId").val();
        if (cardId == null || cardId === '') {
            swal("请先读取就诊卡！", "", "error");
            return false;
        }
        if (drug == null || drug === '') {
            swal("请选择药品！", "", "error");
            return false;
        }
        if (diagnosisResult == null || diagnosisResult === '') {
            swal("请填写初步诊断！", "", "error");
            return false;
        }
        if (medicalOrder == null || medicalOrder === '') {
            swal("请填写医嘱！", "", "error");
            return false;
        }

        var MedicalRecordReqVO = {
            prescription: $("#drugs").html().trim(), // 处方
            registerId:registerId, // 挂号单
            drugCost: allPrice, // 药物总花费
            conditionDescription: $("#conditionDescr").val(), //主述
            diagnosisResult: diagnosisResult, // 初步诊断
            medicalOrder: medicalOrder, //医嘱
            patientId:patientId, // 患者ID
            patientName:patientName // 患者姓名
        };

        $.post("/outpatient/addMedicalRecord",MedicalRecordReqVO,function (data) {
            if (data.state == 200){
                swal({
                    title: "病历信息提交成功,本次就诊完成！",
                    type: "success",
                }, function () {
                    window.location.reload()
                });
            }
            else {
                swal(data.message, "", "error")
            }
        })
    };

    // /**获取体检信息**/
    // function getMedicalExamination() {
    //
    //     var prescriptionNum = $("#prescriptionNum").val();
    //
    //     $.ajax({
    //         url: "/outpatient/getMedicalExamination",
    //         type: "post",
    //         data: {
    //             "prescriptionNum": prescriptionNum
    //         },
    //         success: function (data) {
    //
    //             if (data.message == null) {
    //                 $("#cardId").val(),
    //                     $("#bodyTemperature").val(data.bodyTemperature),
    //                     $("#pulse").val(data.pulse),
    //                     $("#heartRate").val(data.heartRate),
    //                     $("#bloodPressure").val(data.bloodPressure),
    //                     $("#examinationCost").val(data.examinationCost)
    //             } else {
    //                 swal(data.message, "", "error")
    //             }
    //         }
    //     })
    //
    // }

    /** 获取就诊队列 **/
    function getAllOutpatientQueue() {
        $.get("/medicalExamination/getAllOutpatientQueue",function (data) {
            if (data.state == 200){
                var html = '';
                $.each(data.data, function (i, value) {
                    html += '<tr class="alloutpatientqueue">';
                    html += '<th>' + (i + 1) + '</th>';
                    html += '<td>' + value.cardId + '</td>';
                    html += '<td>' + value.name + '</td>';
                    html += ' </tr>'
                });
                $('#alloutpatientqueue').html(html)
            }
            else{
                var html = data.message;
                $('#alloutpatientqueue').html(html);
            }
        })
    }

</script>
</html>